<!--
 * @Descripttion: 项目管理
 * @version:
 * @Author: 赵致喜
 * @Date: 2020-10-15 17:40:22
 * @LastEditors: 穆宏宇
 * @LastEditTime: 2020-11-12 17:49:59
-->
<template>
  <div>
    <div class="control-box">
      <!-- control 操作区 START -->
      <e-control :search-form-options="formOptions"
                 :search-label-width="searchLabelWidth"
                 @on-search="searchControlHandle"
                 @on-refresh="refreshControlHandle"
                 @change-height="changeControlHeight">
      </e-control>
      <!-- control 操作区 END -->
    </div>
    <div class="table-box">
      <!-- table 数据表格 START -->
      <e-table :data="tableData"
               :columns="columns"
               stripe
               :border="true"
               :maxHeight="tableMaxHeight"
               style="width: 100%"
               @selection-change="changeTableSelectData"
               :current="pageData.pageNum"
               :total="pageData.total"
               @page-size-change="changePageSize"
               @page-current-change="changePageCurrent">
<!--        <template slot-scope="{scope}" slot="projectName">-->
<!--          <el-popover placement="top" trigger="hover">-->
<!--            <div class="cell-content">{{scope.row.projectName}}</div>-->
<!--            <p class="overflow" slot="reference">{{scope.row.projectName}}</p>-->
<!--          </el-popover>-->
<!--        </template>-->
        <template slot-scope="{scope}"
                  slot="operation">
          <!-- 询价结束 -->
          <el-tooltip content="查看定标详情"
                      placement="top">
            <!--   v-if="['00026_2','00026_3'].includes(scope.row.projectState)"-->
            <el-button @click="detailsControlHandle(scope.row,'0')"
                       type="warning"
                       size="mini"
                       icon="el-icon-view"
                       plain></el-button>
          </el-tooltip>
          <el-tooltip content="废标"
                      placement="top"
                      v-if="scope.row.projectState === '00026_2'">
            <el-button @click="abandonedDidHandle(scope.row)"
                       type="danger"
                       size="mini"
                       icon="el-icon-document-delete"
                       plain></el-button>
          </el-tooltip>

<!--            <el-tooltip content="修改项目时间"-->
<!--                        placement="top">-->
<!--              <el-button v-if="scope.row.projectState === '00026_0' && scope.row.timeType "-->
<!--                         @click="editProjectsTimeHandle(scope.row)"-->
<!--                         type="danger"-->
<!--                         size="mini"-->
<!--                         icon="el-icon-edit"-->
<!--                         plain></el-button>-->
<!--            </el-tooltip>-->
          <!--  采购人定标 / 竞价结束 -->
          <el-tooltip content="定标结果修改审核"
                      placement="top"
                      v-if="scope.row.picketageState === '00029_1' && scope.row.projectState === '00026_2'">
            <el-button @click="detailsControlHandle(scope.row,'1')"
                       type="danger"
                       size="mini"
                       icon="el-icon-edit-outline"
                       plain></el-button>
          </el-tooltip>
          <!-- 倒计时 -->
          <el-tooltip content="供应商审核"
                      placement="top"
                      v-if="scope.row.projectState === '00026_0'">
            <el-button @click="examineControlHandle(scope.row)"
                       type="danger"
                       size="mini"
                       icon="el-icon-finished"
                       plain></el-button>
          </el-tooltip>
          <el-tooltip content="撤销采购"
                      placement="top"
                      v-if="scope.row.projectState === '00026_0'">
              <el-button @click="cancellationHandle(scope.row)"
                         type="danger"
                         size="mini"
                         icon="el-icon-refresh-left"
                         plain></el-button>
            </el-tooltip>
        </template>
      </e-table>
      <!-- table 数据表格 END -->
    </div>
    <!-- editDialog 定标详情及修改弹窗 START -->


    <el-dialog title="定标详情"
               :visible.sync="editDialogShow"
               :close-on-click-modal="false"
               :close-on-press-escape="false"
               width="80%">
      <h4>过程记录</h4>
      <e-table :data="processRecordData"
               :columns="columns2"
               :pageShow="false"
               stripe
               border
               :maxHeight="tableMaxHeight"
               style="width: 100%">
        <template slot-scope="{scope}" slot="remark">
          <el-popover placement="top" trigger="hover">
            <div class="cell-content">{{scope.row.remark}}</div>
            <p class="overflow" slot="reference">{{scope.row.remark}}</p>
          </el-popover>
        </template>
      </e-table>
      <el-row style="margin:10px 0">
        <h4 class="borderB">项目基本信息</h4>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">项目名称：</el-col>
          <el-col :span="16">
            <template>
              <el-popover placement="top" trigger="hover">
                <div class="cell-content">{{projectData.projectName }}</div>
                <p class="overflow baseInfo-w" slot="reference">{{projectData.projectName }}</p>
              </el-popover>
            </template>
          </el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">项目编号：</el-col>
          <el-col :span="16">{{projectData.projectNo}}</el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">询价开始时间：</el-col>
          <el-col :span="16">{{projectData.startTime | formeTime}}</el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">询价结束时间：</el-col>
          <el-col :span="16">{{projectData.endTime | formeTime}}</el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">项目状态：</el-col>
          <el-col :span="16">{{projectData.projectStateCName}}</el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20" v-if="projectData.projectState === '00026_5'">
          <el-col :span="8"
                  class="text-right">询价失败原因：</el-col>
          <el-col :span="16">
            <template>
              <el-popover placement="top" trigger="hover">
                <div class="cell-content">{{projectData.invalidRemark}}</div>
                <p class="overflow baseInfo-w" slot="reference">{{projectData.invalidRemark}}</p>
              </el-popover>
            </template>
          </el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">定标状态：</el-col>
          <el-col :span="16">{{projectData.picketageStateCName}}</el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">总预算（元）：</el-col>
          <el-col :span="16">{{projectData.sumPrice}}</el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">未税总价（元）：</el-col>
          <el-col :span="16">{{projectData.excludeTaxPrice}}</el-col>
        </el-col>
        <el-col :span="12"
                class="pd5 lineHeight20">
          <el-col :span="8"
                  class="text-right">项目描述：</el-col>
          <el-col :span="16">
            <template>
              <el-popover placement="top" trigger="hover">
                <div class="cell-content">{{projectData.projectRemark}}</div>
                <p class="overflow baseInfo-w" slot="reference">{{projectData.projectRemark}}</p>
              </el-popover>
            </template>
          </el-col>
        </el-col>
      </el-row>
      <!-- 采购人未定标不展示定标信息 -->
      <div v-if="bidPicketageData.picketageState !=='00029_0'"  >
        <el-row style="margin:10px 0">
          <h4 class="borderB">定标信息</h4>
          <el-col :span="12"
                  class="pd5 lineHeight20">
            <el-col :span="8"
                    class="text-right">{{bingModeLabel}}：</el-col>
            <el-col :span="16">{{isMinPrice(bidPicketageData.isMinPrice)}}</el-col>
          </el-col>
          <el-col :span="12"
                  class="pd5 lineHeight20">
            <el-col :span="8"
                    class="text-right">定标时间：</el-col>
            <el-col :span="16">{{bidPicketageData.createTime | formeTime}}</el-col>
          </el-col>
          <el-col :span="24"
                  class="pd5 lineHeight20">
            <el-col :span="4"
                    class="text-right">采购人说明：</el-col>
            <el-col :span="20">
              <template>
                <el-popover placement="top" trigger="hover">
                  <div class="cell-content">{{bidPicketageData.purchaseRemark}}</div>
                  <p class="overflow baseInfo-w" slot="reference">{{bidPicketageData.purchaseRemark}}</p>
                </el-popover>
              </template>
            </el-col>
          </el-col>
          <el-col :span="24"
                  class="pd5 lineHeight20">
            <el-col :span="4"
                    class="text-right">中心审核说明：</el-col>
            <el-col :span="20">
              <template>
                <el-popover placement="top" trigger="hover">
                  <div class="cell-content">{{bidPicketageData.ageinsRemark}}</div>
                  <p class="overflow baseInfo-w" slot="reference">{{bidPicketageData.ageinsRemark}}</p>
                </el-popover>
              </template>
            </el-col>
          </el-col>
          <el-col :span="12"
                  class="pd5 lineHeight20"
                  v-if="bidPicketageData.picketageApplyCompleteSourceId">
            <el-col :span="8"
                    class="text-right">定标申请表下载：</el-col>
            <el-col :span="16">
              <el-button style="padding: 0 !important;" type="text" @click="exportAppleForm(bidPicketageData.picketageApplyCompleteSourceId)">{{ appleFileName }}</el-button>
            </el-col>
          </el-col>
        </el-row>
      </div>

      <el-row style="margin:10px 0">
        <h4 class="borderB">询价规则</h4>
        <div v-for="(item,index) in biddingData" :key="index">
          <el-col :span="12"
                  class="pd5 lineHeight20">
            <el-col :span="8"
                    class="text-right">{{item.controlName}}：</el-col>
            <el-col :span="16">{{item.detailName}}</el-col>
          </el-col>
        </div>
      </el-row>
      <div v-if="dialogType === '0'">
        <h4>报价列表</h4>
        <e-table :data="quotedPriceData"
                 :columns="quotationHeads"
                 stripe
                 border
                 :maxHeight="tableMaxHeight"
                 style="width: 100%"
                 :pageShow="false">
        <!--  state 0:中标 1：未中标 ，只有在中标的时候，显示最终中标报价 -->
        <template slot-scope="{scope}" slot="editSumPrice">
          {{scope.row.state === '0' ? scope.row.editSumPrice : '' }}
        </template>
        </e-table>
      </div>
      <div v-if="dialogType === '1'">
        <div v-for="(item,index) in orderList"
             :key="item.id">
          <div class="demand-block-body bid-box">
            <el-table
                      ref="bidBiddingGoodTable"
                      :data="item.bidBiddingGoodDetailList"
                      border
                      :span-method="arraySpanMethod"
                      style="width: 100%">
              <el-table-column label="排名"
                               width="50">
                <template slot-scope="scope">
                  <div v-if="scope.$index === 0"
                       class="order-head">
                    <span class="order-head-block">联系人：{{item.biddingLinkman}}</span>
                    <span class="order-head-block">手机：{{item.biddingLinkmanMobile}}</span>
                    <span class="order-head-block">询价状态：<span class="order-head-block-state">{{Number(item.biddingState) === 1 ? '参与询价' : '撤销询价'}}</span></span>
                    <span class="order-head-block last-price"
                          v-if="item.editSumPrice">修改总报价：{{item.editSumPrice}}</span>
                    <span v-if="item.purchaseRemark"
                          class="bid-box-cause">修改原因：{{item.purchaseRemark}}</span>
                  </div>
                  <span v-else-if="scope.$index === 1">{{item.ranking}}</span>
                </template>
              </el-table-column>
              <el-table-column label="中标" width="50">
                <template>
                  <img v-if="((isDisplay && index === 0) || Number(item.isPicketage) === 1)"
                       src="@/assets/mall-images/biding.png"
                       alt="">
                </template>
              </el-table-column>
              <el-table-column label="商品名称" width="140">
                <template slot-scope="scope">
                  <el-popover placement="top" trigger="hover">
                    <div class="cell-content">{{scope.row.goodsName}}</div>
                    <p class="overflow bing-style" slot="reference">{{scope.row.goodsName}}</p>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column label="品牌" width="140">
                <template slot-scope="scope">
                  <el-popover placement="top" trigger="hover">
                    <div class="cell-content">{{scope.row.brandName}}</div>
                    <p class="overflow bing-style" slot="reference">{{scope.row.brandName}}</p>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column label="规格型号" width="140">
                <template slot-scope="scope">
                  <el-popover placement="top" trigger="hover">
                    <div class="cell-content">{{scope.row.typeNo}}</div>
                    <p class="overflow bing-style" slot="reference">{{scope.row.typeNo}}</p>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column label="是否含税"
                               prop="includedTax">
                <template slot-scope="scope">
                  <span>{{ Number(scope.row.includedTax) === 0 ? '否' : scope.row.taxRate}}</span>
                </template>
              </el-table-column>
              <el-table-column label="计量单位"
                               prop="unit"></el-table-column>
              <el-table-column label="数量"
                               prop="buyNum"></el-table-column>
              <el-table-column label="预算单价"
                               prop="budget"></el-table-column>
              <el-table-column label="报价单价"
                               prop="biddingPrice"></el-table-column>
              <el-table-column label="总价"
                               prop="sumPrice"></el-table-column>
              <el-table-column label="修改单价"
                               prop="editBiddingPrice"></el-table-column>
              <el-table-column label="修改总价"
                               prop="editSumPrice"></el-table-column>
            </el-table>
          </div>
        </div>
      </div>
      <span slot="footer"
            class="dialog-footer"
            v-if="dialogType === '1'">
        <el-button type="success"
                   @click="saveItemApprovedHandle">审核通过</el-button>
        <el-button type="danger"
                   @click="failedHandle(1)">审核不通过</el-button>
      </span>
    </el-dialog>
    <!-- editDialog 定标详情及修改弹窗 END -->


    <!-- editDialog 供应商审核 START -->
    <el-dialog title="项目详情"
               :visible.sync="editDialogShow1"
               :close-on-click-modal="false"
               :close-on-press-escape="false"
               width="80%">
      <e-table :data="projectDetailsData"
               :columns="columns4"
               stripe
               border
               :pageShow="false"
               :maxHeight="tableMaxHeight"
               style="width: 100%">
      </e-table>
      <div style="margin:10px 0;">
        <h4>供应商报名列表</h4>
      </div>
      <e-table :data="registrationData"
               :columns="columns5"
               stripe
               border
               :pageShow="false"
               :maxHeight="tableMaxHeight"
               style="width: 100%">
        <template slot-scope="{scope}"
                  slot="certificateOperation">
          <el-button @click="checkHandle(scope.row)"
                     type="warning"
                     size="mini"
                     icon="el-icon-view"
                     plain>查看</el-button>
          <el-button v-if="scope.row.auditStatus === 'MOD'"
                     @click="checkHandle(scope.row)"
                     type="danger"
                     size="mini"
                     icon="el-icon-edit"
                     plain>修改审核</el-button>
        </template>
      </e-table>
    </el-dialog>
    <!-- editDialog 供应商审核 END -->


    <!-- editDialog 供应商详情 START -->
    <el-dialog title="供应商详情"
               :visible.sync="editDialogShow2"
               :close-on-click-modal="false"
               :close-on-press-escape="false"
               width="80%">
      <e-table :data="detailTableData"
               :columns="columns6"
               :pageShow="false"
               stripe
               border
               :maxHeight="tableMaxHeight"
               style="width: 100%">
        <template slot-scope="{scope}" slot="auditOpinion">
          <el-popover placement="top" trigger="hover">
            <div class="cell-content">{{scope.row.auditOpinion}}</div>
            <p class="overflow" slot="reference">{{scope.row.auditOpinion}}</p>
          </el-popover>
        </template>
      </e-table>
      <h4 v-if="detailFileList">保证金附件</h4>
      <template>
        <div class="demo-image__preview" v-for="(item,index) in detailFileList" :key="index">
          <el-image style="width: 100px; height: 100px"
                    :src="item.fileUrl"
                    :preview-src-list="queryArr(item.fileUrl)">
          </el-image>
        </div>
      </template>

      <span slot="footer"
            v-if="auditStatusType === 'INI' || auditStatusType === 'MOD'"
            class="dialog-footer">
        <el-button type="success"
                   @click="saveApprovedHandle">审核通过</el-button>
        <el-button type="danger"
                   @click="failedHandle(0)">审核不通过</el-button>
      </span>
    </el-dialog>
    <!-- editDialog 供应商详情 END -->


    <!-- editDialog 修改项目时间 START -->
    <el-dialog title="修改项目询价时间"
               :visible.sync="editDialogShow3"
               :close-on-click-modal="false"
               :close-on-press-escape="false"
               :before-close="cancelProTimeHandle"
               width="35%">
      <el-form :model="projectsTimeForm"
               :rules="projectsTimeRules"
               ref="projectsTimeForm"
               label-width="150px">
        <el-form-item label="询价开始时间"
                      prop="time">
          <el-date-picker v-model="projectsTimeForm.time"
                          type="datetimerange"
                          range-separator="至"
                          start-placeholder="开始日期"
                          end-placeholder="结束日期">
          </el-date-picker>
        </el-form-item>
      </el-form>
      <span slot="footer"
            class="dialog-footer">
        <el-button type="success"
                   @click="saveProTimeHandle">确定</el-button>
        <el-button type="danger"
                   @click="cancelProTimeHandle">取消</el-button>
      </span>
    </el-dialog>
    <!-- editDialog 修改项目时间 END -->


    <!-- editDialog 撤销采购&废标弹窗 START -->
    <el-dialog :title="invalidBidTitle"
               :visible.sync="invalidBidShow"
               :close-on-click-modal="false"
               :close-on-press-escape="false"
               :before-close="cancelInvalidBidHandle"
               width="50%">
      <el-form :model="invalidBidForm"
               :rules="invalidBidRules"
               ref="invalidBidForm"
               label-width="120px">
        <el-form-item v-if="invalidBidTitle === '请填写撤销采购说明'"
                      label="撤销采购说明"
                      prop="remark">
          <el-input type="textarea"
                    maxlength="1000"
                    show-word-limit
                    v-model="invalidBidForm.remark"></el-input>
        </el-form-item>
        <el-form-item v-if="invalidBidTitle === '请填写废标说明'"
                      label="废标说明"
                      prop="explain">
          <el-input type="textarea"
                    maxlength="1000"
                    show-word-limit
                    v-model="invalidBidForm.explain"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer"
            class="dialog-footer">
        <el-button type="primary"
                   @click="saveInvalidBidHandle">确认</el-button>
        <el-button type="info"
                   @click="cancelInvalidBidHandle">取消</el-button>
      </span>
    </el-dialog>
    <!-- editDialog 废标弹窗 END -->


    <!-- editDialog 审核不通过弹窗 START -->
    <el-dialog title="请填写审核意见"
               :visible.sync="auditOpinionShow"
               :close-on-click-modal="false"
               :close-on-press-escape="false"
               :before-close="cancelAuditHandle"
               width="50%">
      <el-form :model="auditOpinionForm"
               :rules="auditOpinionRules"
               ref="auditOpinionForm"
               label-width="100px">
        <el-form-item v-if="auditStatus === 0"
                      label="审核意见"
                      prop="auditOpinion">
          <el-input type="textarea"
                    show-word-limit
                    maxlength="1000"
                    v-model="auditOpinionForm.auditOpinion"></el-input>
        </el-form-item>
        <el-form-item v-else
                      label="审核意见"
                      prop="remark">
          <el-input type="textarea"
                    show-word-limit
                    maxlength="1000"
                    v-model="auditOpinionForm.remark"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer"
            class="dialog-footer">
        <el-button type="primary"
                   @click="saveAuditHandle">确认</el-button>
        <el-button type="info"
                   @click="cancelAuditHandle">取消</el-button>
      </span>
    </el-dialog>
    <!-- editDialog 审核不通过弹窗 END -->


    <!-- editDialog 放大图片 START -->
    <el-dialog :visible.sync="dialogVisible">
      <img width="100%"
           :src="dialogImageUrl"
           alt="">
    </el-dialog>
    <!-- editDialog 放大图片 END -->
  </div>
</template>

<script>
import eControl from '@/components/e-control'
import { getProProjectList, editProProjectsTime, doInvalidBid, getQueryProProcessCodeList, getProProjectInfo, getProjectAndPicketageInfo, getBiddingRules, getBidBiddingPageList, cancelProjects, getCertificatePageList, getDetailById, uppliersCertificateAudit } from '@/api/admin.api'
import { queryDictionaryList, getFileUrl, downloadFile, getFileInfo } from '@/api/common.api'
import { querySecondTime, queryBiddingGoodsListByProject, saveOrder } from '@/api/mall.api'
import moment from 'moment'
import { formOptions, btns } from './control'
import { columns, columns1, columns2, columns3, columns4, columns5, columns6 } from './columns'
export default {
  name: 'project-manager',
  components: {
    eControl
  },
  props: {
  },
  data () {
    return {
      // 表格表头
      columns,
      // 上下架记录表格表头
      columns1,
      // 过程化记录
      columns2,
      // 报价列表
      columns3,
      // 项目详情配置项
      columns4,
      // 供应商报名列表配置项
      columns5,
      // 供应商详情
      columns6,
      // 表单配置项
      formOptions,
      searchLabelWidth: '100px',
      // 按钮组
      btns,
      // 供应商&定标结果状态
      dialogType: '',
      // 提交表单数据
      formData: {},
      // 表单校验
      formRules: {
        name: [
          { required: true, message: '请输入活动名称', trigger: 'blur' },
          { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
        ]
      },
      // 报价表头
      quotationHeads: [],
      // 供应商详情 0 & 定标详情状态 1
      auditStatus: 0,

      // 保证金附件图片
      dialogImageUrl: '',
      // 保证金附件图片放大图
      dialogVisible: false,
      // 上传图片数据
      fileList: [],
      // 管理委托是否展示
      editDialogShow: false,
      // 创建项目是否展示
      editDialogShow1: false,

      // 项目详情
      editDialogShow2: false,
      // 过程记录列表数据
      processRecordData: [],
      // 项目基本信息数据:
      projectData: {},
      // 定标信息数据
      bidPicketageData: {},
      // 竞标规则数据
      biddingData: [],
      // 报价列表数据
      quotedPriceData: [],
      // 订单列表
      orderList: [],
      // 显示默认第一个中标
      isDisplay: false,
      // 修改项目时间是否展示
      editDialogShow3: false,
      // 修改项目时间表单数据
      projectsTimeForm: {},
      // 获取当前时间
      currentTime: '',
      // 修改项目时间表单校验
      projectsTimeRules: {
        time: [
          { required: true, message: '请输入询价时间', trigger: 'blur' }
        ]
      },

      // 撤销&废标标题
      invalidBidTitle: '',
      // 撤销&废标弹窗是否展示
      invalidBidShow: false,
      // 撤销&废标表单数据
      invalidBidForm: {},
      // 撤销&废标表单校验
      invalidBidRules: {
        remark: [
          { required: true, message: '请输入撤销采购说明', trigger: 'blur' }
        ],
        explain: [
          { required: true, message: '请输入废标说明', trigger: 'blur' }
        ]
      },


      // 项目详情数据
      projectDetailsData: [],
      // 保证金附件数据
      detailFileList: [],
      // 供应商报名数据
      registrationData: [],
      // 供应商表格数据
      detailTableData: [],
      // 审核意见弹窗
      auditOpinionShow: false,
      // 审核意见表单
      auditOpinionForm: {},
      // 供应商审核状态
      auditStatusType: '',
      // 审核意见校验
      auditOpinionRules: {
        auditOpinion: [
          { required: true, message: '请输入审核说明', trigger: 'blur' }
        ],
        remark: [
          { required: true, message: '请输入审核说明', trigger: 'blur' }
        ]
      },
      // 编辑框表单数据
      dialogFormCurrent: {},
      // 查询表单
      searchFormData: {},
      // 控制区高度
      controlHeight: 0,
      // 表格数据
      tableData: [],
      // 分页数据
      pageData: {
        // 当前分页
        pageNum: 1,
        // 分页条数
        pageSize: 10,
        // 数据总数
        total: 0
      },
      // 表格选中数据
      tableSelectData: [],
      // 定标申请表名称
      appleFileName:'',
      // 竞拍模式
      bingMode: {},
      bingModeLabel:'',
      // 项目ID
      fkProProjectsId:''
    }
  },
  watch: {
    bingMode (val) {
      if (Object.keys(val).length > 0) {
        if (val.detailName.indexOf('正拍') != -1) {
          this.bingModeLabel = '是否最高价中标'
        } else if(val.detailName.indexOf('反拍') != -1){
          this.bingModeLabel = '是否最低价中标'
        } else {
          this.bingModeLabel = ''
        }
      }
    }
  },
  filters: {
    formeTime (val) {
      return val ? moment(val).format('YYYY-MM-DD HH:mm:ss') : ' '
    }
  },
  computed: {
    //表格最大高度
    tableMaxHeight () {
      return window.innerHeight - this.controlHeight - 160
    },
    isMinPrice () {
      return function (val) {
        if (val === '0') {
          return '否'
        } else if (val === '1') {
          return  '是'
        } else {
          return ''
        }
      }
    }
  },
  methods: {
    /**
     * @description 申请表名称
     * @author 穆宏宇
     * @date 2020-11-13 10:28:42
     * @param
     * @return
     * */
    getAppleFileName (value) {
      const objItem = JSON.parse(value)
      // 获取附件信息
      getFileInfo(objItem.fileType,objItem.id).then(res=>{
        this.appleFileName = res.submittedFileName
      })
    },
    /**
     * @description 导出定标申请表
     * @author 穆宏宇
     * @date 2020-11-13 09:46:43
     * @param
     * @return
     * */
    exportAppleForm (jsonComment) {
      const objFile = JSON.parse(jsonComment)
      getFileInfo(objFile.fileType,objFile.id).then(res=>{
        const fileName = res.submittedFileName
        downloadFile(objFile.fileType,objFile.id).then(resBlob=>{
          const blob = new Blob([resBlob], {
            type: 'application/msword'
          })
          this.saveAs(blob, fileName)
        })
      })
    },
    saveAs(blob, filename) {
      if (window.navigator.msSaveOrOpenBlob) {
        navigator.msSaveBlob(blob, filename)
      } else {
        const link = document.createElement('a')
        const body = document.querySelector('body')
        link.href = window.URL.createObjectURL(blob)
        link.download = filename
        link.style.display = 'none'
        body.appendChild(link)
        link.click()
        body.removeChild(link)
        window.URL.revokeObjectURL(link.href)
      }
    },
    // 查询项目状态option
    getProjectStatustOptions () {
      const param = { dictionaryType: 'project_status' }
      queryDictionaryList(param).then((res) => {
        res.map((item, index) => {
          const optionObj = {}
          optionObj.label = item.optional1
          optionObj.value = item.dictionaryKey1
          this.$set(this.formOptions[2].options, index, optionObj)
        })
      })
    },
    // 查询项目状态option
    getPicketageStatusOptions () {
      const param = { dictionaryType: 'picketage_state' }
      queryDictionaryList(param).then((res) => {
        res.map((item, index) => {
          const optionObj = {}
          optionObj.label = item.optional1
          optionObj.value = item.dictionaryKey1
          this.$set(this.formOptions[3].options, index, optionObj)
        })
      })
    },
    // 取消上传图片
    handleRemove (file, fileList) {
      console.log(file, fileList)
    },

    // 上传图片
    handlePreview (file) {
      getFileUrl(file.fileType,file.id).then(res=>{
        this.dialogImageUrl = res
        this.dialogVisible = true
      })
    },

    // 选中上传图片限制
    handleExceed (files, fileList) {
      this.$message.warning(`最多可上传 3 个附件，您已超限`)
    },
    // 放大图片展示
    handlePictureCardPreview (file) {
      this.dialogImageUrl = file.url
      this.dialogVisible = true
    },
    // 页面初始化数据
    init () {
      this.getTableData()
    },
    // 查询项目列表
    searchControlHandle (data) {
      this.searchFormData = data
      // this.currentTime = this.formeTime(new Date())
      this.refreshPageCurrent()
    },
    // 重置查询条件
    refreshControlHandle (data) {
      this.searchFormData = data
    },
    // 控制区高度设置
    changeControlHeight (height) {
      this.controlHeight = height
    },
    // 管理委托弹窗
    entrustedControlHandle () {
      this.openDialog()
    },
    // 供应商审核弹窗
    examineControlHandle (row) {
      getProProjectInfo(row.id).then(res => {
        const filter = this.$options.filters['formeTime']
        this.projectDetailsData = [{
          projectNo: res.projectNo,
          projectName: res.projectName,
          projectState: res.projectState,
          picketageState: res.picketageState,
          startTime: filter(res.startTime),
          endTime: filter(res.endTime)
        }]
      })
      this.fkProProjectsId = row.id
      // 供应商报名列表
      this.getSupplierList (row.id)
      this.editDialogShow1 = true
    },
    // 供应商报名列表
    getSupplierList (fkProProjectsId) {
      getCertificatePageList({ fkProProjectsId: fkProProjectsId }).then(res => {
        this.registrationData = res.records
      })
    },
    // 获取选中行数据
    changeTableSelectData (rows) {
      this.tableSelectData = rows
    },
    // 修改分页条数，请求数据
    changePageSize (size) {
      this.pageData.size = size
      this.getTableData()
    },
    // 修改当前分页，请求数据
    changePageCurrent (current) {
      this.pageData.current = current
      this.getTableData()
    },
    // 重置当前分页
    refreshPageCurrent () {
      this.pageData.current = 1
      this.getTableData()
    },
    // 获取项目列表数据
    getTableData () {
      const newSearchData = { ...this.searchFormData, ...this.pageData }
      // 查询剩余时间，添加时间状态参数，用于判断是否显示修改项目时间
      getProProjectList(newSearchData).then(res => {
        const filter = this.$options.filters['formeTime']
        const newArr = []
        res.records.map(item => {
          querySecondTime({ endTime: item.startTime }).then(res => {
            if (res > 0) {
              item.timeType = true
            } else {
              item.timeType = false
            }
          })
          this.$nextTick(() => {
            item.startTime = filter(item.startTime)
            item.endTime = filter(item.endTime)
            newArr.push(item)
          })
        })
        this.$nextTick(() => {
          this.tableData = newArr
          this.pageData.total = res.total
        })
      })
    },
    // 管理委托弹窗展开
    openDialog () {
      this.editDialogShow = true
    },
    // 管理委托弹窗关闭
    closeDialog () {
      this.editDialogShow = false
    },
    // 项目详情弹窗
    detailsControlHandle (row, type) {
      this.dialogType = type
      this.editDialogShow = true
      // 获取过程记录信息
      getQueryProProcessCodeList({ sourceIds: row.id + ',' + row.id }).then(res => {
        this.processRecordData = res
      })
      // 获取项目基本信息
      getProProjectInfo(row.id).then(res => {
        this.projectData = res
      })
      // 获取定标信息
      getProjectAndPicketageInfo({ projectId: row.id }).then(res => {
        this.bidPicketageData = res
        if (res.picketageApplyCompleteSourceId) {
          this.getAppleFileName(res.picketageApplyCompleteSourceId)
        }
      })
      // 获取询价规则
      getBiddingRules(row.id).then(res => {
        this.biddingData = res
        const arr = res.filter(item => item.controlName === '竞拍模式')
        this.bingMode = arr.length > 0 ? arr[0] : {}
      })
      // 获取报价列表
      const projects = { fkProProjectsId: row.id }
      getBidBiddingPageList(projects).then(res => {
        const quoteList = res.records
        // 没有修改过报价，就不显示最终定标价格
        const editSumPriceList =  quoteList.filter(item=>item.editSumPrice)
        if (editSumPriceList.length === 0) {
          const arrHead = [...this.columns3];
          arrHead.splice(5,1);
          this.quotationHeads = arrHead;
        }
        this.quotedPriceData = quoteList
      })
      // 查询报价信息及报价详情
      queryBiddingGoodsListByProject({ projectId: row.id }).then(res => {
        if (res.length > 0) {
          res.forEach(item => {
            if (item.bidBiddingGoodDetailList.length > 0) {
              const emptyData = {} // 数据头插入空数据,处理第一行表格合并
              item.bidBiddingGoodDetailList.unshift(emptyData)
            }
            item['checked'] = false
          })
        }
        this.orderList = res
        if (this.dialogType === '1'){
          this.$nextTick(()=>{
            // 供应商修改竞标列表
            const vueComponent = this.$refs.bidBiddingGoodTable
            vueComponent.forEach(item=>{
              // table 表格重新布局
              item.doLayout()
            })
          })
        }
      })
    },
    // 表格列合并
    arraySpanMethod ({ row, column, rowIndex, columnIndex }) {
      if (rowIndex === 0) {
        if (columnIndex === 0) {
          return [1, 13]
        } else if (columnIndex === 1) {
          return [0, 0]
        }
      }
      if (rowIndex >= 2) {
        if (columnIndex === 0) {
          return [1, 2]
        } else if (columnIndex === 1) {
          return [0, 0]
        }
      }
    },
    // 预览附件
    clickHandlePreview (value) {
      if (value !== null && value !== undefined && value) {
        let objItem = ''
        if (value instanceof Object) {
          objItem = value
        } else {
          objItem = JSON.parse(value)
        }
        // 获取附件信息
        getFileInfo(objItem.fileType,objItem.id).then(res=>{
          if (['image/png','image/jpeg'].includes(res.contextType)) {
            this.dialogImageUrl = res.url
            this.dialogVisible = true
          } else {
            // 下载
            document.location.href = res.url
          }
        })
      }
    },
    // 查看供应商详情
    checkHandle (row) {
      this.editDialogShow2 = true
      getDetailById(row.certificateId).then((res) => {
        res.suppChinaName = row.suppChinaName
        const detailArr = []
        detailArr.push(res)
        this.detailTableData = detailArr
        this.auditStatusType = res.auditStatus
        this.detailFileList = res.fileList
      })
    },
    // 放大图数组转换
    queryArr (url) {
      const urlArr = []
      urlArr.push(url)
      return urlArr
    },
    // 审核通过
    saveApprovedHandle () {
      const auditObj = {
        id: this.detailTableData[0].id,
        auditStatus: 'SUC'
      }
      this.$confirm('确认是否审核通过', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        uppliersCertificateAudit(auditObj).then((res) => {
          this.$message({
            message: '审核通过',
            type: 'success'
          })
          this.editDialogShow2 = false
          // 供应商报名列表
          this.getSupplierList(this.fkProProjectsId)
          // 获取项目列表数据
          this.getTableData ()
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '取消审核'
        })
      })

    },
    // 审核不通过弹窗
    failedHandle (type) {
      this.auditStatus = type
      this.auditOpinionShow = true
    },
    // 审核不通过保存
    saveAuditHandle () {
      // 供应商资质审核不通过
      if (this.auditStatus === 0) {
        const failedObj = {
          auditOpinion: this.auditOpinionForm.auditOpinion,
          id: this.detailTableData[0].id,
          auditStatus: 'FAIL'
        }
        this.$refs['auditOpinionForm'].validate((valid) => {
          if (valid) {
            uppliersCertificateAudit(failedObj).then(res => {
              this.auditOpinionShow = false
              this.editDialogShow2 = false
              this.editDialogShow = false
              this.$refs['auditOpinionForm'].resetFields()
              this.$message({
                message: '保存成功',
                type: 'success'
              })
              this.getTableData()
            })
          }
        })
      }
      // 定标定标审核通不通过
      else {
        const itemAuditObj = {
          branchId: '0d829f59bcc245c3ad5cc83392ad4a2d',
          data: {
            projectId: this.projectData.id,
            remark: this.auditOpinionForm.remark
          },
          processCode: 'process13_002'
        }
        this.$refs['auditOpinionForm'].validate((valid) => {
          if (valid) {
            saveOrder(itemAuditObj).then(res => {
              this.auditOpinionShow = false
              this.editDialogShow2 = false
              this.editDialogShow = false
              this.$refs['auditOpinionForm'].resetFields()
              this.$message({
                message: '保存成功',
                type: 'success'
              })
              this.getTableData()
            })
          }
        })
      }
    },
    // 审核通过取消
    cancelAuditHandle () {
      this.auditOpinionShow = false
      this.auditOpinionForm = {}
    },

    // 定标结果修改审核通过
    saveItemApprovedHandle () {
      const itemAuditObj = {
        branchId: '0d829f59bcc245c3ad5cc83392ad4a2d',
        data: {
          projectId: this.projectData.id,
          remark: ''
        },
        processCode: 'process13_001'
      }
      this.$confirm('确认是否审核通过', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        saveOrder(itemAuditObj).then((res) => {
          this.$message({
            message: '审核通过',
            type: 'success'
          })
          this.editDialogShow2 = false
          this.editDialogShow = false
          this.getTableData()
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '取消审核'
        })
      })
    },

    // 修改项目时间弹窗
    editProjectsTimeHandle (row) {
      this.projectsTimeForm = row
      this.editDialogShow3 = true
    },
    // 保存修改项目时间
    saveProTimeHandle () {
      const that = this
      const timeObj = {
        id: this.projectsTimeForm.id,
        startTime: this.projectsTimeForm.time[0],
        endTime: this.projectsTimeForm.time[1]
      }
      this.$refs['projectsTimeForm'].validate((valid) => {
        if (valid) {
          editProProjectsTime(timeObj).then((res) => {
            this.$message({
              message: '项目时间已修改',
              type: 'success'
            })
            that.cancelProTimeHandle()
          })
        }
      })
    },
    // 取消修改项目时间
    cancelProTimeHandle () {
      this.editDialogShow3 = false
      this.$refs['projectsTimeForm'].resetFields()
      this.projectsTimeForm = {}
    },
    // 废标弹窗显示
    abandonedDidHandle (row) {
      this.invalidBidTitle = '请填写废标说明'
      this.invalidBidForm.projectsId = row.id
      this.invalidBidShow = true
    },
    // 撤销项目显示
    cancellationHandle (row) {
      this.invalidBidTitle = '请填写撤销采购说明'
      this.invalidBidForm.projectsId = row.id
      this.invalidBidShow = true
    },
    // 保存撤销项目&废标
    saveInvalidBidHandle () {
      this.$refs['invalidBidForm'].validate((valid) => {
        if (valid) {
          if (this.invalidBidTitle === '请填写废标说明') {
            doInvalidBid(this.invalidBidForm.projectsId, { explain: this.invalidBidForm.explain }).then((res) => {
              this.$message({
                message: '已废标',
                type: 'success'
              })
              this.cancelInvalidBidHandle()
            })
          }
          if (this.invalidBidTitle === '请填写撤销采购说明') {
            cancelProjects(this.invalidBidForm).then(res => {
              this.$message({
                message: '已撤销采购',
                type: 'success'
              })
              this.cancelInvalidBidHandle()
            })
          }
        }
      })
    },
    // 取消撤销项目&废标
    cancelInvalidBidHandle () {
      this.invalidBidShow = false
      this.$refs['invalidBidForm'].resetFields()
      this.invalidBidForm = {}
    }
  },
  created () { },
  mounted () {
    this.getProjectStatustOptions()
    this.getPicketageStatusOptions()
    this.init()
  }
}
</script>
<style lang="scss" scoped>
.control-box {
  margin-bottom: 10px;
}
.text-right {
  text-align: right;
}
.pd5 {
  padding: 5px;
}
h4 {
  line-height: 30px;
}
.borderB {
  border-bottom: 1px solid #ccc;
}
.el-button--mini {
  margin: 0 5px 10px !important;
}
.borderB {
  border-bottom: 1px solid #ccc;
}
.lineHeight20 {
  line-height: 20px;
}
.bid-box {
  &-cause {
    padding: 10px 10px 0 10px;
  }
  ::v-deep .el-table .el-table__body .el-table__row:first-child {
    background-color: orange !important;
    &:hover > td {
      background-color: orange !important;
    }
  }
  ::v-deep .el-table .cell {
    padding: 0 !important;
  }
}
.order-head {
  height: 100%;
  color: white;
  text-align: left;
  &-block {
    padding: 5px 10px;
    &-state {
      color: blue;
    }
  }
  .last-price {
    background-color: white;
    color: red;
  }
}
.editor-quotation {
  border: 1px solid #999999;
  margin: 20px;
  padding: 10px;
  .el-form-item--mini.el-form-item {
    margin-bottom: 0;
  }
}
.cell-content {
  width: 200px;
  min-height: 20px;
  max-height: 200px;
  overflow-y: auto;
}
.overflow {
  width: 118px;
  white-space: nowrap;
  text-overflow: ellipsis;
  -o-text-overflow:ellipsis;
  overflow: hidden;
}
.bing-style {
  padding: 0 10px;
  text-align: center;
}
.baseInfo-w {
  width: 218px !important;
}
/*注意deep两侧都要有空格*/
.table-box {
  ::v-deep .el-table__header {
    th:last-child{
      border-left: 1px solid #dfe6ec !important;
    }
  }
  ::v-deep .el-table__row{
    td:not(.is-hidden):last-child{
      border-left: 1px solid #dfe6ec !important;
    }
  }
}
.baseInfo-w {
  width: 218px !important;
}
</style>

<style lang="css">

.el-tooltip__popper,.el-tooltip__popper.is-dark{
  background: #FFFFFF;
  max-width: 400px;
  border-radius: 4px;
  border: 1px solid #e6ebf5;
  padding: 12px;
  color: black;
  line-height: 180%;
  -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.el-tooltip__popper[x-placement^=top] .popper__arrow {
  /*border-top-color: rgba(0,0,0,0.4);*/
  bottom: -6px;
  left: 50%;
  margin-right: 3px;
  border-top-color: #FFFFFF;
  border-bottom-width: 0;
  -webkit-filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
  filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
}
.el-tooltip__popper[x-placement^=top] .popper__arrow:after {
  /*border-top-color: rgba(0,0,0,0.4);*/
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
  /*filter:alpha(opacity=50);
  -moz-opacity:0.5;
  -khtml-opacity: 0.5;
  opacity: 0.5;*/
}
</style>
